<!DOCTYPE html>
<script src="../../resources/js-test.js"></script>
<script src="../../resources/run-after-layout-and-paint.js"></script>
<style>
#scroller {
    border: 1px solid black;
    height: 400px;
    width: 400px;
    overflow: auto;
    position: absolute;
    font: 10pt monospace;
    padding: 20px;
    top: 50px;
    left: 150px;
}
.spacer {
    width: 100px;
    height: 1000px;
    background-color: #ddf;
    margin: 20px;
    display: inline-block;
}
</style>
<div id="scroller">
    <a name="top"></a>text<br>
    <span class="spacer"></span>
</div>
<script>
var jsTestIsAsync = true;
var scroller = document.querySelector("#scroller");
scroller.scrollTop = 400;
runAfterLayoutAndPaint(function() {
    location.hash = "#top";
    shouldBe("scroller.scrollTop", "20");
    location.hash = "#";
    finishJSTest();
});
</script>
